<template>
<uni-shadow-root class="partials-coupons-second_coupons_with_boxshadow-second_coupons_with_boxshadow"><template name="second_coupons_with_boxshadow">
<block v-if="relateBean.length!=0">
<scroll-view class="coupons_wrapp" scroll-x="true">
<block v-for="(item,index) in (relateBean)" :key="item.index">
    <view class="coupons_box" @click="click" :data-id="item.id" :data-index="index" :style="'border: 1px solid '+(defaultColor)+'; border-left:none;'">
         <view class="circle" :style="'border: 2px solid '+(defaultColor)+';'"></view>
         <view class="xian" :style="'background-color: '+(defaultColor)+';'"></view>
         <view class="xian1" :style="'background-color: '+(defaultColor)+';'"></view> 
         <view class="select" :style="'  background-color: '+(defaultColor)+';'">
            <view class="selectText">立即领取</view>
         </view> 
    </view>
</block>
<view class="coupons_box1" @click="clickLink" :style="' border: 1px solid '+(defaultColor)+'; '">
  <view class="coupons_box1_text">
    <text>更多好卷</text>
  </view>
</view>
</scroll-view>
</block>
<block v-if="relateBean.length==0">
    <view class="noproduct">
      <image mode="widthFix" src="https://image1.sansancloud.com/xianhua/2019_12/16/15/54/55_950.jpg?x-oss-process=style/preview_120"></image>
      <text>没有相关的优惠卷</text>
    </view> 
</block>
</template></uni-shadow-root>
</template>

<script>

global['__wxRoute'] = 'partials/coupons/second_coupons_with_boxshadow/second_coupons_with_boxshadow'

Component({})

export default global['__wxComponents']['partials/coupons/second_coupons_with_boxshadow/second_coupons_with_boxshadow']
</script>
<style platform="mp-weixin">
.coupons_wrapp{
  height: 160rpx;
  white-space: nowrap;
  display: flex;
  overflow: hidden;
}
.coupons_box {
   width: 244rpx;
   height: 152rpx;
   display: inline-block;
   margin-left: 24rpx;
   overflow: hidden;
   position: relative;
}
.circle{
    width: 50rpx;
    height: 50rpx;
     background-color: white; 
    border-radius: 50%;
    position: absolute;
    left: -25rpx;
    top: 51rpx;
    z-index: 50;
}
.xian{
    width: 2rpx;
    height: 51rpx;
    position: absolute;
    left: 0rpx;
    top: 0rpx;
    z-index: 50;
}
.xian1{
    width: 2rpx;
    height: 51rpx;
    position: absolute;
    left: 0rpx;
    top: 104rpx;
    z-index: 50;
}
.coupons_box_text{
  height: 152rpx;
  margin-left: 40rpx;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
}
.youhuiMoney{
  height:50rpx;
   text-align: left;
   display: block;
   line-height: 50rpx;
   overflow: hidden;
}
.youhuiMoney.fir{
   font-size: 35rpx;
   color: #DF3348;
}
.sec{
   font-size: 20rpx;
   color: #DF3348;
}
.youhuiname{
   height:40rpx;
   display: block;
   line-height: 40rpx;
   overflow: hidden;
}
.youhuiname text{
  font-size: 20rpx;
  color:rgba(153,153,153,1);
}
.youhuiremark{
  height:40rpx;
  text-align: left;
  display: block;
  line-height: 40rpx;
  overflow: hidden;
}
.youhuiremark text{
  font-size: 20rpx;
}
.select{
  width: 50rpx;
  height: 152rpx;
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center
}
.selectText{
    width: 40rpx;
    margin: 10rpx auto;
    text-align: center;
    font-size: 25rpx;
    line-height: 40rpx;
    letter-spacing:10rpx;
    color: #fff;
    writing-mode: vertical-lr;  
    writing-mode: tb-lr;
}
/*更多好卷  */
.coupons_box1{
  width: 240rpx;
  height: 152rpx;
  margin-left: 24rpx;
  display: inline-block; 
  position: relative;
}
.coupons_box1_text{
    width: 240rpx;
    height: 152rpx;
    font-size: 35rpx;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}
</style>